#box {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  background-color: #D0F8E2;
}
.recall .top {
  position: relative;
  width: 100%;
}
.recall .top image {
  width: 100%;
  display: block;
}
.recall .list {
  margin-top: -2px;
  padding: 0 4vw 4vw 4vw;
  background-color: #D0F8E2;
}
.recall .list .head {
  background-color: #8EDFC4;
  padding: 10px 0;
  border-radius: 2vw 2vw 0 0;
  position: relative;
}
.recall .list .head .rule {
  font-size: 3.2vw;
  color: #fff;
  position: absolute;
  right: 3vw;
  top: 5vw;
}
.recall .list .head .rule image {
  width: 1.5vw;
}
.recall .list .head .iconPool {
  width: 30vw;
  height: 8vw;
  margin: 0 auto;
}
.recall .list .head .iconPool .text {
  width: 8vw;
  font-size: 3.2vw;
  line-height: 4vw;
  color: #096048;
  float: left;
  margin-right: 0.5vw;
}
.recall .list .head .iconPool .num {
  width: 5vw;
  height: 8vw;
  border-radius: 1vw;
  background-color: #FD9B5E;
  color: #fff;
  font-size: 6vw;
  font-weight: 700;
  text-align: center;
  float: left;
  margin-right: 1.5vw;
}
.recall .list .head .iconPool .dong {
  font-size: 3vw;
  background-color: #FFBA00;
  padding: 0 1vw;
  line-height: 4vw;
  border-radius: 4vw;
  color: #CD2017;
  position: absolute;
  right: 3vw;
  top: -4vw;
  z-index: 20;
  display: none;
}
.recall .list .head .iconPool .dong.on {
  display: block;
  animation: numdong 0.8s linear 1;
}
.recall .list .uls {
  border-radius: 0 0 2vw 2vw;
  background-color: #fff;
  padding: 0 3vw 5vw 3vw;
}
.recall .list .uls .norecall {
  font-size: 3.47vw;
  text-align: center;
  line-height: 35vw;
}
.recall .list .uls .lis {
  padding: 3vw 0vw;
  border-bottom: 1px solid #F5f5f5;
  overflow: hidden;
}
.recall .list .uls .lis image {
  width: 9vw;
  height: 9vw;
  border-radius: 9vw;
  float: left;
  margin-right: 2vw;
}
.recall .list .uls .lis .info {
  float: left;
  color: #333333;
  font-size: 3.47vw;
  line-height: 9vw;
}
.recall .list .uls .lis .call {
  padding: 0;
  border: none;
  margin-top: 1.5vw;
  float: right;
  width: 13.3vw;
  height: 6.67vw;
}
.recall .list .uls .lis .call .recallBtn {
  width: 13.3vw;
  height: 6.67vw;
  color: #fff;
  font-size: 3.47vw;
  background-color: #FD9B5E;
  line-height: 6.67vw;
  text-align: center;
}
.recall .list .uls .btn {
  padding: 0;
  border: none;
  width: 81.3vw;
  height: 11.73vw;
  margin: 0 auto;
  margin-top: 5vw;
}
.recall .list .uls .btn .invite {
  width: 81.3vw;
  height: 11.73vw;
  line-height: 11.73vw;
  background-color: #FD9B5E;
  color: #fff;
  text-align: center;
  margin: 0 auto;
  font-size: 4vw;
  border-radius: 11.73vw;
}
@keyframes numdong {
  0% {
    top: -4vw;
    transform: scale(1.1);
  }
  25% {
    top: -5vw;
    transform: scale(1.2);
  }
  50% {
    top: -6vw;
    transform: scale(1.3);
  }
  75% {
    top: -7vw;
    transform: scale(1.4);
  }
  100% {
    top: -8vw;
    transform: scale(1.5);
  }
}
